<template>
	<view class="pages-box">
		<view class="form-box padding30">
			<u-form :modle="form" :rules="rules" ref="form" :errorType="errorType" label-width="140">
				<u-form-item label="姓名" prop="name" :required="true">
					<u-input  placeholder="请输入姓名" v-model="form.name" type="text"></u-input>
				</u-form-item>
				<u-form-item label="身份证" prop="coid">
					<u-input  placeholder="请输入身份证" v-model="form.coid" type="text"></u-input>
				</u-form-item>
				<u-form-item label="年龄" prop="age">
					<u-input  placeholder="请输入年龄" v-model="form.age" type="text"></u-input>
				</u-form-item>
				<u-form-item label="通讯地址" prop="address1" :required="true">
					<u-input type="select" :select-open="addrShow" name="address1" v-model="form.address1" @click="addrShow = true" placeholder="请选择归属地"/>
					<u-select
						v-model="addrShow" 
						value-name="id"
						label-name="name"
						child-name="children"
						mode="mutil-column-auto" 
						:default-value="defaultAddr"
						:list="addresList" 
						@confirm="addrChange"
					></u-select>
				</u-form-item>
				<u-form-item label="街道/社区" prop="address2" :required="false">
					<u-input type="select" :select-open="pickerShow" name="address2" v-model="form.address2" @click="pickerShow = true" placeholder="请选择地址"/>
					<!-- <u-picker mode="region" v-model="pickerShow" :defaultRegion="defaultRegion" @confirm="addressChange"></u-picker> -->
					<u-select
						v-model="pickerShow" 
						value-name="id"
						label-name="name"
						child-name="children"
						mode="mutil-column-auto" 
						:default-value="defaultRegion"
						:list="addressListJie" 
						@confirm="addressChange"
					></u-select>
				
				</u-form-item>
				<u-form-item label="详细地址" prop="address" :required="true">
					<u-input  placeholder="请输入详细地址" v-model="form.address" type="text"></u-input>
				</u-form-item>
			</u-form>
		</view>
		<view class="btn-box pad30 acea-row row-center-wrapper row-middle">
			<button class="btn-item acea-row row-center-wrapper row-middle font600 size32" type="primary" shape="circle" size="medium" style="width: 100%;" @click="saveEdit">
				提交
			</button>
		</view>
	</view>
</template>

<script>
	import store from '@/store';
	import {mapGetters} from "vuex";
	import {getAddList, saveEditUser, getUserInfo, getAddresListJie} from '@/api/user.js'
	import {getTreeArr, deleteEmpty, flatten} from '@/utils/utils.js';
	import { toLogin } from '@/libs/login';
	let app = getApp();
	export default {
		computed: mapGetters(['isLogin', 'chatUrl', 'userInfo', 'uid']),
		data() {
			return {
				addrShow:false,
				pickerShow:false,
				form:{
					name:'',
					coid:'',
					age:'',
					address_xian:0,
					address_jie:0,
					address_qu:0,
					address_sheng:0,
					address_shi:0,
					// address_xians:'',
					address:'',
					address1:'',
					address2:'',
				},
				defaultAddr:[],
				defaultRegion:[],
				addressListJie:[],
				addresList:[],
				errorType: ['message'],
				rules: {
					name: [
						{
							required: true, 
							transform(value) {
							  return String(value);
						    },
							message: '请填写姓名', 
							trigger: ['change','blur']
						},
					],
					address1: [
						{
							required: true, 
							transform(value) {
							  return String(value);
							}, 
							message: '请选择通讯地址', 
							trigger: ['change','blur'],
						},
					],
					address2: [
						{
							required: true, 
							transform(value) {
							  return String(value);
							}, 
							message: '请选择通讯地址', 
							trigger: ['change','blur'],
						},
					],
					address: [
						{
							required: true,
						    transform(value) {
						      return String(value);
						    },
						    message: '请填写详细地址', 
						    trigger: ['change','blur'],
					    },
					]
				},
			};
		},
		created() {
			if(!this.isLogin){
				toLogin()
			}else{
				this.form = {
					name:this.userInfo.name,
					coid:this.userInfo.coid,
					age:this.userInfo.age,
					address_xian:this.userInfo.address_xian,
					address_jie:this.userInfo.address_jie,
					address_qu:this.userInfo.address_qu,
					address_sheng:this.userInfo.address_sheng,
					address_shi:this.userInfo.address_shi,
					address:this.userInfo.address,
				}
				// if(this.userInfo.address_sheng == 0 && this.userInfo.address_shi == 0 && this.userInfo.address_xian == 0){
				// 	 this.$set(this.form, 'address1', '')
				// 	 this.defaultRegion = []
				//  }else{
				// 	let address1 = (this.userInfo.address_sheng !== null ? this.userInfo.address_sheng : '') +' '+(this.userInfo.address_shi !== null ? this.userInfo.address_shi : '')+' '+(this.userInfo.address_xians !== null ? this.userInfo.address_xian : '')
				// 	this.$set(this.form, 'address1', address1)
				// 	this.defaultRegion = [this.userInfo.address_sheng, this.userInfo.address_shi, this.userInfo.address_xians]
				//  }
				this.getAddList()
				this.getAddresListJie(this.form.address_xian)
			}
		},
		onReady() {
			this.$refs.form.setRules(this.rules);
		},
		methods:{
			getAddresListJie(id){
				getAddresListJie({ad_id:id}).then(res=>{
					if(res.code == 900){
						this.addressListJie = res.data.children
						console.log('this.addressListJie',this.addressListJie)
						if(this.userInfo.address_jie == 0 && this.userInfo.address_qu == 0){
								this.$set(this.form, 'address2', '')
								this.defaultRegion = []
							}else{
								let addr1I = this.addressListJie.findIndex(item => item.id == this.userInfo.address_jie)
								let child = this.addressListJie[addr1I].children
								let addr2I = child.length > 0 ? child.findIndex(item => item.id == this.userInfo.address_qu) : -1
								// let childs = this.addressListJie[addr1I].children[addr2I].children
								// let addr3I = childs.length > 0 ? childs.findIndex(item => item.id == this.userInfo.address_qu) : -1
								
								let address2 = this.addressListJie[addr1I].name +' '+(addr2I > -1? this.addressListJie[addr1I].children[addr2I].name:'')
								this.$set(this.form, 'address2', address2)
								this.defaultRegion = [addr1I,addr2I]
							}
						
					}
				})
			},
			addrChange(e){
				// console.log('e', e)
				this.$set(this.form, 'address1', '')
				let address1=''
				e.map((val, index) => {
					address1 += address1 == '' ? val.label : ' ' + val.label;
					if(index == 0) this.form.address_sheng = val.value
					if(index == 1) this.form.address_shi = val.value
					if(index == 2) this.form.address_xian = val.value
				})
				this.$set(this.form, 'address1', address1)
				let index1 = this.addresList.findIndex(item => item.id === e[0].value)
				let child = this.addresList[index1].children
				let index2 = child.length > 0 ? child.findIndex(item => item.id === e[1].value) : -1
				let childs = this.addresList[index1].children[index2].children
				let index3 = childs.length > 0 ? childs.findIndex(item => item.id === e[2].value) : -1
				this.defaultAddr = [index1,index2,index3]
				this.userInfo.address_jie = 0
				this.userInfo.address_qu = 0
				this.addressListJie = []
				this.getAddresListJie(this.form.address_xian)
			},
			addressChange(e){
				// console.log('e', e)
				this.$set(this.form, 'address2', '')
				let address2=''
				e.map((val, index) => {
					address2 += address2 == '' ? val.label : ' ' + val.label;
					if(index == 0) this.form.address_jie = val.value
					if(index == 1) this.form.address_qu = val.value
				})
				this.$set(this.form, 'address2', address2)
				let index1 = this.addresList.findIndex(item => item.id === e[0].value)
				let child = this.addresList[index1].children
				let index2 = child.length > 0 ? child.findIndex(item => item.id === e[1].value) : -1
				// let childs = this.addresList[index1].children[index2].children
				// let index3 = childs.length > 0 ? childs.findIndex(item => item.id === e[2].value) : -1
				this.defaultRegion = [index1,index2]
			},
			getAddList(){
				getAddList().then(res=>{
					if(res.code == 900){
						console.log('res.data',res.data)
						// this.addresList = res.data
						this.addresList = flatten(res.data)
						if(this.userInfo.address_sheng == 0 && this.userInfo.address_shi == 0 && this.userInfo.address_xian == 0){
							this.$set(this.form, 'address1', '')
							this.defaultAddr = []
						}else{
							let addr1I = this.addresList.findIndex(item => item.id == this.userInfo.address_sheng)
							let child = this.addresList[addr1I].children
							let addr2I = child.length > 0 ? child.findIndex(item => item.id == this.userInfo.address_shi) : -1
							let childs = this.addresList[addr1I].children[addr2I].children
							let addr3I = childs.length > 0 ? childs.findIndex(item => item.id == this.userInfo.address_xian) : -1
							
							let address1 = this.addresList[addr1I].name +' '+(addr2I > -1? this.addresList[addr1I].children[addr2I].name:'')+' '+(addr3I > -1 ? this.addresList[addr1I].children[addr2I].children[addr3I].name:'')
							this.$set(this.form, 'address1', address1)
							this.defaultAddr = [addr1I,addr2I,addr3I]
						}
					}
				})
			},
			saveEdit(){
				this.$refs.form.validate(valid => {
					console.log('valid',valid)
					if (valid) {
						// delete this.form.address1
						// delete this.form.address2
						if(this.form.name == '') return this.$base.Tips({title:'请填写姓名'})
						if(this.form.address1 == '') return this.$base.Tips({title:'请选择通讯地址'})
						// if(this.form.address2 == '') return this.$base.Tips({title:'请选择通讯地址'})
						if(this.form.address == '') return this.$base.Tips({title:'请填写详细地址'})
						let param = {
							name:this.form.name,
							coid:this.form.coid,
							age:this.form.age,
							address_xian:this.form.address_xian,
							address_jie:this.form.address_jie,
							address_qu:this.form.address_qu,
							address_sheng:this.form.address_sheng,
							address_shi:this.form.address_shi,
							address:this.form.address,
							id:this.uid,
							token:store.state.app.token
						}
						saveEditUser(param).then(res=>{
							if(res.code == 900){
								this.getUserInfo()
							}
						}).catch(err=>{
							return this.$base.Tips({
								title: err || '修改失败',
								icon:'errer'
							});
						})
					} else {
						console.log('验证失败');
					}
				});
				
			},
			getUserInfo(){
				let param = {
					userid:this.uid,
					token:store.state.app.token
				}
				getUserInfo(param).then(res=>{
					if(res.code == 900){
						this.$store.commit("UPDATE_USERINFO", res.data);
						return this.$base.Tips({
							title: '修改成功',
							icon: 'success'
						},{
							tab:3,
							url: '/pages/main/index'
						});
					}
				}).catch(err=>{
					return this.$base.Tips({
						title: err || '修改失败'
					}, {
						tab: 3,
						url: 1
					});
				})
			}
		}
	}
</script>

<style lang="less">

</style>
